import Point from '../utils/Point.js';
import * as Utils from './utils.js';

var SVG = {
    minNumber: -Number.MAX_VALUE,
    maxNumber: Number.MAX_VALUE,

    createElement: function(type, attributes) {
        var element = document.createElementNS('http://www.w3.org/2000/svg', type);
        if (attributes && attributes.length) {
            var pairs = attributes.split(';');
            for (var i = 0; i < pairs.length; i++) {
                var a = pairs[i].split(':');
                element.setAttribute(a[0], a[1]);
            }
        }
        return element;
    },
    createGroupFromString: function(string) {
        let groupString = "<g xmlns='http://www.w3.org/2000/svg'>" + string + '</g>';
        let svgDocument = new DOMParser().parseFromString(groupString, 'image/svg+xml');
        // return svgDocument;
        return document.importNode(svgDocument.documentElement, true);
    },
    createRect: function(x, y, w, h, fill, stroke, strokeWidth) {
        var element = document.createElementNS('http://www.w3.org/2000/svg', 'rect');

        element.setAttribute('x', x);
        element.setAttribute('y', y);
        element.setAttribute('width', w);
        element.setAttribute('height', h);

        if (fill) element.setAttribute('fill', fill);
        if (stroke) element.setAttribute('stroke', stroke);
        if (strokeWidth) element.setAttribute('stroke-width', strokeWidth);

        return element;
    },
    createCircle: function(x, y, r, fill, stroke, strokeWidth) {
        var element = document.createElementNS('http://www.w3.org/2000/svg', 'circle');

        element.setAttribute('cx', x);
        element.setAttribute('cy', y);
        element.setAttribute('r', r);

        if (fill) element.setAttribute('fill', fill);
        if (stroke) element.setAttribute('stroke', stroke);
        if (strokeWidth) element.setAttribute('stroke-width', strokeWidth);

        return element;
    },
    createMatrix: function(element, dimensions, padding) {
        let width = parseInt(getComputedStyle(element.parentNode).width, 10),
            height = parseInt(getComputedStyle(element.parentNode).height, 10),
            xMin = dimensions[0],
            xMax = dimensions[1],
            yMin = dimensions[2],
            yMax = dimensions[3],
            p = (100 - (typeof padding !== 'undefined' ? padding : 10)) / 100,
            scale = Math.min((width * p) / (xMax - xMin), (height * p) / (yMax - yMin)),
            offsX = width / 2 - (scale * (xMax - xMin)) / 2 - scale * xMin,
            offsY = height / 2 + (scale * (yMax - yMin)) / 2 + scale * yMin,
            matrix = element.createSVGMatrix();

        matrix = matrix.translate(offsX, offsY);
        matrix = matrix.scale(scale);
        matrix = matrix.flipY();

        return matrix;
    },
    getTranslation: function(matrix) {
        return new Point(matrix.e, matrix.f);
    },
    getRotation: function(matrix) {
        return Utils.degrees(Math.atan2(-matrix.b, matrix.a));
    },
    getScaling: function(matrix) {
        var sx = Math.sqrt(matrix.a * matrix.a + matrix.b * matrix.b);
        var sy = Math.sqrt(matrix.c * matrix.c + matrix.d * matrix.d);

        return new Point(sx, sy);
    },
    getElementDimensions: function(element) {
        var b = element.getBBox();
        return [b.x, b.x + b.width, b.y, b.y + b.height];
    }
};

export default SVG;
